<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org">


<div class="">
	<div class="page-title">
		<div class="title_left">
			<h3>角色管理</h3>
		</div>
	</div>
	<div class="clearfix"></div>

	<div class="row">
		<div class="col-md-12 col-sm-12 col-xs-12">
			<div class="x_panel">
				<div class="x_title">
					<h2>
						角色编辑 <small>新增</small>
					</h2>
					<ul class="nav navbar-right panel_toolbox">
						<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
						</li>
						<li><a class="close-link"><i class="fa fa-close"></i></a></li>
					</ul>
					<div class="clearfix"></div>
				</div>
				<div class="x_content">

					<form class="form-horizontal form-label-left" id="roleAddForm"  th:action="@{/role/Add}" method="post" novalidate>

						<div class="item form-group">
							<label class="control-label col-md-3 col-sm-3 col-xs-12"
								for="rolename"> 角色名 <span class="required">*</span>
							</label>
							<div class="col-md-6 col-sm-6 col-xs-12">
								<input type="text" id="rolename" name="rolename" required="required"
									  data-validate-length-range="1,20"
									class="form-control col-md-7 col-xs-12">
							</div>
						</div>
						<div class="item form-group">
							<label for="roledesc" class="control-label col-md-3">角色描述<span class="required">*</span>
							</label>
							<div class="col-md-6 col-sm-6 col-xs-12">
								<input id="roledesc" type="text" name="roledesc"
									data-validate-length-range="6,8"
									class="form-control col-md-7 col-xs-12" required="required">
							</div>
						</div>
						<div class="item form-group">
							<label for="roledesc" class="control-label col-md-3">是否可用<span class="required">*</span>
							</label>
							<div class="col-md-6 col-sm-6 col-xs-12">
							<label class="btn btn-default" data-toggle-class="btn-primary" data-toggle-passive-class="btn-default">
								<input type="radio" name="enable"  th:checked="checked"  value="true"> &nbsp; true &nbsp;
							</label>
							<label class="btn btn-primary" data-toggle-class="btn-primary" data-toggle-passive-class="btn-default">
								<input type="radio" name="enable"   value="false" > false
							</label>
							</div>
						</div>
						<div class="ln_solid"></div>
						<div class="form-group">
							<div class="col-md-6 col-md-offset-3">
								<button th:onclick="'javascript:LoadAjaxContent(\'role/GetAllRole\')'" class="btn btn-primary">取消</button>
								<button  th:onclick="'javascript:SubmitRoleAddForm()'" class="btn btn-success">提交</button>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>
</div>

<script >
function SubmitRoleAddForm(){
        $.ajax({
            mimeType: 'text/html; charset=utf-8', // ! Need set mimeType only when run from local file
            url: "/role/Add",
            type: 'POST',
            data: $('#roleAddForm').serialize(),
            success: function(data) {
                $('#ajax_content').html(data);
            },
            error: function (jqXHR, textStatus, errorThrown) {
                alert(errorThrown);
            },
            dataType: "html",
            async: false
        });
}
</script>
</html>